<template>
    <div class="home-container">

        location: {{location}}<br>
        city: {{city}}<br>
        address: {{address}}

    </div>
</template>

<script>
    export default {
        name: "index",
        data() {
            return {
                location: '111.017393,21.531189',
                city: null,
                address: null
            }
        },
        created() {
            this.getCity(this.location)
        },
        methods: {
            getCity(location) {
                let self = this
                AMap.service('AMap.Geocoder',function(){//回调函数
                    //实例化Geocoder
                    var geocoder = new AMap.Geocoder();

                    //使用geocoder 对象完成相关功能
                    console.log(geocoder)
                    geocoder.getAddress(location, function (status, result) {
                        console.log(status)
                        console.log(result)
                        if(status === 'complete' && result.info === 'OK') {
                            self.city = result.regeocode.addressComponent.city
                            self.address = result.regeocode.formattedAddress
                            console.log(result.regeocode.addressComponent.city)
                            console.log(result.regeocode.formattedAddress)
                        }
                    })
                })
            }
        }
    }
</script>

<style rel="stylesheet/scss" lang="scss" scoped>


</style>
